<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello world</title>
    <script src="../vue.global.js"></script>
</head>
<body>
<div id="root"></div>
<script>
    const vue = {
        data() {
            return {
                show: true,
                num: 1,
                msg: "yuanpengyue"
            }
        },
        template: `
          <div style="width: 200px;height:100px;background-color:greenyellow;margin:0 auto">
          <div style="display:inline-block;margin:10px 50px" v-show="show">{{ num }}</div>
          <button @click="func">按钮</button>
          </div>
        `,
        mounted() {
            setInterval(() => {
                // this.data.num += 2;
                this.$data.num += 1
            }, 1000)
        },
        methods: {
            func() {
                this.show = !this.show;
            }
        }
    };
    let app = Vue.createApp(vue);
    app.mount("#root");
</script>
</body>
</html>
